<template>
  <div class="content">
    <OrdeHeader @parentFun="parentSch" @stateFun="stateSch" ref="header" />
    <OrdeTable :arr="arr" @resetFather="getData" @openDialog="tabDialog" @resparFun="getData" />
    <OrdePage :total="total" />
    <!-- <Dialog ref="dialog" /> -->
    <Dialog v-if="isShow" ref="dialog" />
    <!-- <button @click="getData">按钮</button> -->
  </div>
</template>

<script>
import OrdeHeader from "./components/OrdeHeader.vue";
import OrdeTable from "./components/OrdeTable.vue";
import OrdePage from "./components/OrdePage.vue";
import Dialog from "./components/dialog.vue";
import { getOrder } from "../../api/order/Order";
import { lookOrder } from "../../api/order/Order";
export default {
  components: {
    OrdeHeader,
    OrdeTable,
    OrdePage,
    Dialog
  },
  data() {
    return {
      arr: [],
      search: "",
      isShow: false,
      page: 1,
      pageSize: 10,
      total: 0,
      uid: -1
    };
  },
  mounted() {
    this.getData();
  },
  methods: {
    //首屏函数
    getData(val) {
      const params = {
        search: this.search,
        page: this.page,
        pageSize: this.pageSize,
        state: val
      };
      getOrder(params).then(res => {
        console.log(res);
        if (res.code == 200) {
          this.arr = res.data;
          this.total = res.total;
          this.page = res.page;
        }
      });
    },
    parentSch(val) {
      this.search = val;
      this.getData();
    },
    //状态切换
    stateSch(uid) {
      this.uid = uid;
      this.getData(uid);
    },
    tabDialog(id) {
      this.isShow = true;
      lookOrder(id).then(res => {
        console.log(res.data);
        this.$nextTick(() => {
          this.$refs.dialog.gridData = [res.data];
        });
      });
    }
  }
};
</script>

<style lang='less' scoped>
.content {
  padding: 20px 10px;
}
</style>